HomeNoticeBar.tsx 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. "use client";
  2. import { BannerRep } from "@/api/home";
  3. import Box from "@/components/Box";
  4. import { Swiper } from "antd-mobile";
  5. import { FC } from "react";
  6. interface Props {
  7. notices: BannerRep[];
  8. }
  9. const HomeNoticeBar: FC<Props> = (props) => {
  10. const { notices } = props;
  11. console.log(`🚀🚀🚀🚀🚀-> in HomeNoticeBar.tsx on 11`, notices);
  12. return (
  13. <div className={"my-[0.0694rem] flex items-center"}>
  14. <div className={"iconfont icon-laba mr-[0.06rem] text-[yellow]"}></div>
  15. <Swiper
  16. direction="vertical"
  17. className={"text-[yellow]"}
  18. indicator={() => null}
  19. style={{ "--height": "0.4167rem" }}
  20. loop
  21. autoplay
  22. >
  23. {notices.map((notice, index) => (
  24. <Swiper.Item key={index}>
  25. <Box
  26. none
  27. action={notice.action_type}
  28. className={
  29. "flex h-[0.4167rem] items-center overflow-hidden" +
  30. " flex-wrap text-ellipsis"
  31. }
  32. actionData={notice.action_params}
  33. >
  34. <div dangerouslySetInnerHTML={{ __html: notice.content! }}></div>
  35. </Box>
  36. </Swiper.Item>
  37. ))}
  38. </Swiper>
  39. </div>
  40. );
  41. };
  42. export default HomeNoticeBar;